/*
Naijanimi Free SMS Application for Nokia mobiles.

"Naijanimi Free SMS Application" is protected by the copyright law
(c) 2011 Enrico Miglino / Tech Consulting (enrico.miglino@ovi.com)
Distributed under the LGPL 3.0 license.

This file is part of "Naijanimi Free SMS Application".

    "Naijanimi Free SMS Application" is free software: you can redistribute it
    and/or modify it under the terms of the Lesser GNU General Public License
    as published by the Free Software Foundation, either version 3 of the License, or
    (at your option) any later version.

    "Naijanimi Free SMS Application" is distributed in the hope that it
    will be useful, but WITHOUT ANY WARRANTY; without even the implied warranty of
    MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
    Lesser GNU General Public License for more details.

    You should have received a copy of the Lesser GNU General Public License
    along with "Naijanimi Free SMS Application".
    If not, see <http://www.gnu.org/licenses/>.
*/

import QtQuick 1.0

// Registration form for new users
Item {
    id: register

    // Signal to close this form tree and return to the
    // main view (flip to front)
    signal exitClicked
    // Real sizes are set when the object is instantiated
    width: 300; height: 300

    // Main background recatngle
    Rectangle {
        id: background
        width: parent.width
        height: parent.height
        radius: 0

        // Background gradient definition (green + grey)
        gradient: Gradient {
            GradientStop { position: 0; color: "#ffffff"; }
            GradientStop { position: 0.75; color: "#6f9c89"; }
            GradientStop { position: 1; color: "#4c605e" }
        }
    }

    /************************************************************************
      Form elements
    ************************************************************************/

    // Background
    Rectangle {
        id: formbackground

        width: parent.width * .90
        height: parent.height * 0.90
        color: "#e8e8e8"
        radius: 15
        border.width: 3
        border.color: "#6b959e"

        // These properties change the button row width and
        // the size of every button.
        property int numButtons: 2; property int buttonsSpacing: 1
        property int formBorder: 3; property int fieldSpacing: 1
        property int formSpacing: 2; property int fieldHeight: 55
        property int buttonHeight: 55; property int textHeigh: 35

        anchors.horizontalCenter: register.horizontalCenter
        anchors.verticalCenter: register.verticalCenter

        // Calculate the with of the buttons.
        function getButtonWidth() {
            var result;

            result = (formbackground.width - formbackground.buttonsSpacing - (formbackground.formBorder * 2)) / 2;
            return result;
        }

        // Choice buttons
        Row {
            id: buttons

            spacing: formbackground.buttonsSpacing
            width: parent.width - formbackground.formBorder * 2
            visible: true

            // Anchors buttons to the bottom of the screen
            anchors {
                bottom: parent.bottom
                bottomMargin: formbackground.formBorder
                horizontalCenter: formbackground.horizontalCenter
            }

            Button {
                id: btnSend

                width: formbackground.getButtonWidth(); height: formbackground.buttonHeight
                color: 'blue'; operation: "Send"
            }

            Button {
                id: btnCancel

                width: formbackground.getButtonWidth(); height: formbackground.buttonHeight
                color: 'blue'; operation: "Cancel"
                onClicked: { register.exitClicked() }
            }
        }

        // Input fields
        Column {
            id: fields

            spacing: formbackground.fieldSpacing
            width: parent.width - formbackground.formBorder * 4
            visible: true

            anchors {
                top: parent.top
                topMargin: formbackground.formBorder * 4
                horizontalCenter: formbackground.horizontalCenter
            }

            Text {
                id: lblName1
                height: formbackground.textHeigh
                text: "First name"
            }

            InputField {
                id: fieldName
                width: parent.width - formbackground.formBorder * 2
                height: formbackground.fieldHeight
            }

            Text {
                id: lblName2
                height: formbackground.textHeigh
                text: "Second name"
            }

            InputField {
                id: fieldSurname
                width: parent.width - formbackground.formBorder * 2
                height: formbackground.fieldHeight
            }

            Text {
                id: lblName3
                height: formbackground.textHeigh
                text: "Country Code"
            }

            InputField {
                id: fieldPrefix
                width: parent.width - formbackground.formBorder * 2
                height: formbackground.fieldHeight
            }

            Text {
                id: lblName4
                height: formbackground.textHeigh
                text: "Mobile Number"
            }

            InputField {
                id: fieldMobile
                width: parent.width - formbackground.formBorder * 2
                height: formbackground.fieldHeight
            }

            Text {
                id: lblName5
                height: formbackground.textHeigh
                text: "E-mail"
            }

            InputField {
                id: fieldEmail
                width: parent.width - formbackground.formBorder * 2
                height: formbackground.fieldHeight
            }
        }
    }
}
